<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<html lang="en">
<head>
<meta charset="utf-8" />
<head>
<base href="<%=basePath%>">

<title>用户管理</title>

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="">
<meta http-equiv="description" content="">
<!-- basic styles -->
<link href="<%=basePath %>admin/assets/css/bootstrap.min.css" rel="stylesheet" />
<link rel="stylesheet" href="<%=basePath %>admin/assets/css/font-awesome.min.css" />
<link rel="stylesheet" href="<%=basePath %>admin/assets/css/jquery-ui-1.10.3.custom.min.css" />
<link rel="stylesheet" href="<%=basePath %>admin/assets/css/jquery.gritter.css" />

<!--[if IE 7]>
      <link rel="stylesheet" href="<%=basePath %>admin/assets/css/font-awesome-ie7.min.css" />
    <![endif]-->
<!-- page specific plugin styles -->
<!-- fonts -->
<!-- ace styles -->

<link rel="stylesheet" href="<%=basePath %>admin/assets/css/ace.min.css" />
<link rel="stylesheet" href="<%=basePath %>admin/assets/css/ace-rtl.min.css" />
<link rel="stylesheet" href="<%=basePath %>admin/assets/css/ace-skins.min.css" />
<link rel="stylesheet" href="<%=basePath %>admin/assets/css/messenger.css" />
<link rel="stylesheet" href="<%=basePath %>admin/assets/css/messenger-theme-future.css" />
<link rel="stylesheet" href="<%=basePath %>admin/assets/css/demo.css" />
<link rel="stylesheet" href="<%=basePath %>admin/assets/css/zTreeStyle.css" />

<link rel="stylesheet" href="<%=basePath %>admin/assets/css/chosen.css" />
<link rel="stylesheet" href="<%=basePath %>admin/assets/css/select2.css" />

<!--[if lte IE 8]>
      <link rel="stylesheet" href="<%=basePath %>admin/assets/css/ace-ie.min.css" />
    <![endif]-->
<!-- inline styles related to this page -->
<!-- ace settings handler -->

<script src="<%=basePath %>admin/assets/js/ace-extra.min.js"></script>

<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
    <script src="<%=basePath %>admin/assets/js/html5shiv.js"></script>
    
    <script src="<%=basePath %>admin/assets/js/respond.min.js"></script>
    <![endif]-->
<link href="<%=basePath %>admin/assets/css/backOffice/backOffice.css" rel="stylesheet" />
</head>

<body>
	<div id="bgdiv"
		style="position:absolute; z-index:1000; background-color:white;width:100%;height:100%;"></div>
	<div class="page-content">
		<div class="page-header">
			<h1
				style="text-align: left; margin: -6px 0px -18px -2px; color: rgb(131, 105, 105); font-family: 微软雅黑; line-height: 34px;">用户管理</h1>
		</div>
		<div class="row">
			<div class="col-xs-12">
				<div class="table-responsive">
					<table id="sample-table-2"
						class="table table-striped table-bordered table-hover">

						<button class='btn btn-primary btn-sm' id='butadd'>
							<i class='icon-plus-sign bigger-110'></i><span
								class='bigger-110 no-text-shadow'>新增用户</span>
						</button>

						<button class='btn btn-danger btn-sm' style='margin-left: 4px'
							id='butdel'>
							<i class='icon-trash bigger-110'></i><span
								class='bigger-110 no-text-shadow'>删除用户</span>
						</button>
						<thead>
							<tr>
								<th class="center"><label> <input type="checkbox"
										class="ace" /> <span class="lbl"></span> </label></th>
								<th align="center">编号</th>
								<th align="center">用户名</th>
								<th align="center">账号</th>
								<th align="center">隶属用户组</th>
								<th align="center">操作</th>
							</tr>
						</thead>

						<tbody>
							<c:forEach items="${userList }" var="user">
								<tr>
									<td class="center"><label> <input type="checkbox"
											class="ace" /> <span class="lbl"></span> </label></td>
									<td align="center">${user.userID }</td>
									<td align="center">${user.name}</td>
									<td align="center">${user.account}</td>
									<td align="center">${user.userGroupNames}</td>
									<td align="center">
										<div class="btn-group ">
											<button data-toggle="dropdown"
												class="btn btn-primary btn-xs dropdown-toggle">
												操作 <span class="icon-caret-down icon-on-right"></span>
											</button>

											<ul class="dropdown-menu dropdown-info pull-right"
												style="min-width:77px;">
												<li style="list-style:none;"><a class="modify11"
													style="text-decoration: none;cursor:pointer;"
													onclick="modifyUser(${user.userID})">修改</a></li>
												<li style="list-style:none;"><a class="seperate11"
													style="text-decoration:none;cursor:pointer;"
													onclick="showTree(${user.userID})">分配权限</a></li>

											</ul>

										</div> <!-- /btn-group -->
									</td>
								</tr>
							</c:forEach>
						</tbody>
					</table>
				</div>
			</div>
		</div>

		<!--Begin Modole-->
		<div class="modal fade" id="myModal" tabindex="-1" role="dialog"
			aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal">
							<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
						</button>
						<h4 class="modal-title" id="myModalLabel">用户管理</h4>
					</div>
					<div class="modal-body">
						<!--添加模态窗口内容-->
						<div class="row">
							<div class="col-sm-3">
								<label for="form-field-select-1">用&nbsp;&nbsp;户&nbsp;&nbsp;名</label>
							</div>
							<div class="col-sm-7">
								<input type="text" id="NickName" placeholder="昵称（例：白云）"
									class="form-control">
							</div>
							<i class="icon-lightbulb tooltip-success cuitooltip form-success"
								data-toggle="tooltip" data-placement="right"
								title="必填：长度为2-5个字（汉字、字母、下划线）" id="tpname"></i>
						</div>

						<div class="row">
							<div class="col-sm-3">
								<label for="form-field-select-1">所属用户组</label>
							</div>
							<div class="col-sm-7">
								<select multiple id="userGroupID">
									<c:forEach items="${userGroupList }" var="aug">
										<option value="${aug.groupID}">${aug.name}</option>
									</c:forEach>
								</select>
							</div>
							<i class="icon-lightbulb tooltip-success cuitooltip form-success"
								data-toggle="tooltip" data-placement="right" title="必选：请选择用户类型"
								id="tpname"></i>
						</div>

						<div class="row">
							<div class="col-sm-3">
								<label for="form-field-select-1">账&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;号</label>
							</div>
							<div class="col-sm-7">
								<input type="text" id="UserName" placeholder="登陆账号"
									class="form-control">
							</div>
							<i class="icon-lightbulb tooltip-success cuitooltip form-success"
								data-toggle="tooltip" data-placement="right"
								title="必填:长度为3-6个字（只限英文字母）" id="tpname"></i>
						</div>

						<div class="row">
							<div class="col-sm-3">
								<label for="form-field-select-1">密&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;码</label>
							</div>
							<div class="col-sm-7">
								<input type="password" id="UserPassword" placeholder="密码"
									class="form-control">

							</div>

							<i class="icon-lightbulb tooltip-success cuitooltip form-success"
								data-toggle="tooltip" data-placement="right"
								title="必填:长度为6-15个字（字母、数字、下划线）" id="tpname"></i>
							<button class="btn btn-minier btn-white icon-eye-close"
								style="margin-left: -55px;" id="LookPWD"></button>
						</div>

						<div class="row">
							<div class="col-sm-3">
								<label for="form-field-select-1">确认密码</label>
							</div>
							<div class="col-sm-7">
								<input type="password" id="UserPassword1" placeholder="密码"
									class="form-control">
							</div>
							<i class="icon-lightbulb tooltip-success cuitooltip form-success"
								data-toggle="tooltip" data-placement="right"
								title="必填:两次输入密码保证一致" id="tpname"></i>
						</div>


						<div class="row">
							<div class="col-sm-3">
								<label for="form-field-select-1">备&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;注</label>
							</div>
							<div class="col-sm-7">
								<textarea class="form-control" id="Description"
									placeholder="备注..." rows="5"></textarea>
							</div>
						</div>


					</div>
					<div class="modal-footer">
						<input type="hidden" id="idHidden" />
						<button type="button" class="btn btn-default" data-dismiss="modal"
							id="but_infoclose">关闭</button>
						<button type="button" class="btn btn-primary" id="but_saveadd">保存</button>
						<button type="button" class="btn btn-primary" style="display:none"
							id="but_savemodify">保存</button>
					</div>
				</div>
			</div>
		</div>
		<!--End Modole-->
		<!--Begin TreeModole-->
		<div class="modal fade" id="myTreeModal" tabindex="-1" role="dialog"
			aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal">
							<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
						</button>
						<h4 class="modal-title" id="myModalLabel">权限分配</h4>
					</div>
					<div class="modal-body">
						<!--添加模态窗口内容-->
						<ul id="treeDemo" class="ztree"
							style="height: 353px; overflow-x: auto; overflow-y: auto; border:0px;margin-top:0px;background-color:white;width:100%"></ul>

					</div>
					<div class="modal-footer">
						<input type="hidden" id="idTreeHidden" />
						<button type="button" class="btn btn-default" data-dismiss="modal"
							id="but_infoclose">关闭</button>
						<button type="button" class="btn btn-primary" id="but_savetree">保存</button>
					</div>
				</div>
			</div>
		</div>
		<!--End TreeModole-->

	</div>
	<!-- basic scripts -->
	<!--[if !IE]> -->
	<!--<script src="http://cdn.bootcss.com/jquery/2.0.3/jquery.min.js"></script>-->
	<!-- <![endif]-->
	<!--[if IE]>
    <script src="http://cdn.bootcss.com/jquery/1.10.2/jquery.min.js"></script>
    <![endif]-->
	<!--[if !IE]> -->

	<script type="text/javascript">
	window.jQuery
		|| document
			.write("<script src='<%=basePath %>admin/assets/js/jquery-2.0.3.min.js'>"
				+ "<" + "script>");
    </script>

	<!-- <![endif]-->
	<!--[if IE]>
    <script type="text/javascript">
     window.jQuery || document.write("<script src='<%=basePath %>admin/assets/js/jquery-1.10.2.min.js'>"+"<"+"script>");
    </script>
    <![endif]-->

	<script type="text/javascript">
	if ("ontouchend" in document)
	    document
		    .write("<script src='<%=basePath %>admin/assets/js/jquery.mobile.custom.min.js'>"
			    + "<" + "script>");
    </script>
	<script src="<%=basePath %>admin/assets/js/bootstrap.min.js"></script>
	<script src="<%=basePath %>admin/assets/js/typeahead-bs2.min.js"></script>

	<!-- page specific plugin scripts -->
	<!--[if lte IE 8]>
      <script src="<%=basePath %>admin/assets/js/excanvas.min.js"></script>
    <![endif]-->

	<script src="<%=basePath %>admin/assets/js/jquery-ui-1.10.3.custom.min.js"></script>
	<script src="<%=basePath %>admin/assets/js/jquery.ui.touch-punch.min.js"></script>
	<script src="<%=basePath %>admin/assets/js/jquery.slimscroll.min.js"></script>
	<script src="<%=basePath %>admin/assets/js/bootbox.min.js"></script>
	<script src="<%=basePath %>admin/assets/js/jquery.easy-pie-chart.min.js"></script>
	<script src="<%=basePath %>admin/assets/js/jquery.sparkline.min.js"></script>
	<script src="<%=basePath %>admin/assets/js/flot/jquery.flot.min.js"></script>
	<script src="<%=basePath %>admin/assets/js/flot/jquery.flot.pie.min.js"></script>
	<script src="<%=basePath %>admin/assets/js/flot/jquery.flot.resize.min.js"></script>
	<script src="<%=basePath %>admin/assets/js/jquery.gritter.min.js"></script>
	<!-- ace scripts -->

	<script src="<%=basePath %>admin/assets/js/ace-elements.min.js"></script>
	<script src="<%=basePath %>admin/assets/js/ace.min.js"></script>

	<script src="<%=basePath %>admin/assets/js/jquery.dataTables.min.js"></script>
	<script src="<%=basePath %>admin/assets/js/jquery.dataTables.bootstrap.js"></script>
	<!-- inline scripts related to this page -->
	<script src="<%=basePath %>admin/assets/js/messenger.js"></script>
	<script src="<%=basePath %>admin/assets/js/messenger.min.js"></script>

	<script src="<%=basePath %>admin/assets/js/jquery.ztree.core-3.5.min.js"></script>
	<script src="<%=basePath %>admin/assets/js/jquery.ztree.excheck-3.5.min.js"></script>

	<script src="<%=basePath %>admin/assets/js/chosen.jquery.min.js"></script>
	<script src="<%=basePath %>admin/assets/js/select2.min.js"></script>

	<script type="text/javascript" src="<%=basePath %>admin/base/user/js/js_User.js"></script>
	<script type="text/javascript">
	$(function() {
	    $(".cuitooltip").tooltip({
		animation : true,
		trigger : 'hover'
	    });
	});
    </script>
</body>
</html>
